<template>
  <div>
    <van-nav-bar title="商品详情" left-arrow @click-left="onClickLeft" />
    <van-image width="100%" height="250px" :src="'http://localhost:3000'+gooodsInfo.img" />
    <h1>{{gooodsInfo.goodsname}}</h1>
    <van-goods-action>
      <van-goods-action-icon icon="chat-o" text="客服" />
      <van-goods-action-icon icon="cart-o" text="购物车" />
      <van-goods-action-icon icon="shop-o" text="店铺" />
      <van-goods-action-button type="danger" text="加入购物车" @click="add(gooodsInfo.id)" />
    </van-goods-action>
  </div>
</template>
<script>
export default {
  data() {
    return {
      gooodsInfo: {},
      userInfo:{}
    };
  },
  created() {
    this.userInfo = JSON.parse(localStorage.getItem("userInfo"));
    this.getData(this.$route.params.id);
  },
  methods: {
    getData(id) {
      this.$http.get("getgoodsinfo", { params: { id } }).then(res => {
        this.gooodsInfo = res.data.list[0];
      });
    },
    onClickButton() {},
    onClickLeft() {
      this.$router.go(-1);
    },
    add(id) {
      if (JSON.parse(localStorage.getItem("userInfo"))) {
        this.$http
          .post("cartadd", { uid: this.userInfo.uid, goodsid: id, num: 1 })
          .then(res => {
            this.$toast({
              message: "添加成功",
              position: "bottom"
            });
          });
      } else {
        this.$toast.fail("请先登录");
      }
    }
  }
};
</script>
<style>
h1 {
  margin: 0;
  padding: 0;
}
</style>